/**
 * 图片预览组件
 * @Author: linzy
 * @Date: 2022-09-23
 * @function ImageViewer
 * @param {array} type - 'app/viewer'
 * @param {object} payload - {visible: true, images: [], activeIndex: 0}
 * @example 配合dva状态管理 dispatch({ type: 'app/viewer', payload: {visible: true, images: [], activeIndex: 0}})
 */
import React from "react";
import Viewer from "react-viewer";
import { setDefaultAttrs } from "@/hooks/tools";
import { connect } from "dva";
const viewerInit = {
  activeIndex: 0,
  images: [],
  visible: false,
};

export default connect(({ app }) => ({ viewer: app.viewer }))((props = {}) => {
  const { viewer, dispatch, ...restProps } = props;
  const { activeIndex, images, visible } = viewer;
  setDefaultAttrs(restProps, {
    visible,
    onClose: () => dispatch({ type: "app/setViewer", payload: viewerInit }),
    onMaskClick: () => dispatch({ type: "app/setViewer", payload: viewerInit }),
    scalable: false,
    attribute: false,
    noImgDetails: true,
    downloadable: true,
    zoomSpeed: 0.15,
    activeIndex,
    images,
  });
  return <Viewer {...restProps}></Viewer>;
});
